<template>
    <div>
        <div class="Supervision">
            <div demo-bg style="display: flex;">
                <dv-border-box10 class="DadaV">
                    <div dv-bg>
                        <div class="Supervision1">
                            <div>
                                <p>监管市县数量</p>
                                <p><b id="b1">10</b>个</p>
                            </div>
                        </div>
                    </div>
                </dv-border-box10>
                <dv-border-box10 class="DadaV">
                    <div dv-bg>
                        <div class="Supervision2">
                            <div>
                                <p>监管矿山数量</p>
                                <p><b id="b1">1234</b>家</p>
                            </div>
                        </div>
                    </div>
                </dv-border-box10>
                <dv-border-box10 class="DadaV">
                    <div dv-bg>
                        <div class="Supervision3">
                            <div>
                                <p>监管企业数量</p>
                                <p><b id="b1">2.3</b>家</p>
                            </div>
                        </div>
                    </div>
                </dv-border-box10>
            </div>
        </div>
    </div>
</template>

<script setup>

</script>

<style scoped lang="scss">
.Supervision {
    width: 100%;
    height: 100%;
    display: flex;
    margin-bottom: 10px;
    font-size: 30px;

    .DadaV {
        width: 290px;
        height: 170px;
        margin-right: 20px;
    }

    .Supervision1 {
        width: 290px;
        height: 170px;
        background-color: rgba(37, 74, 184, 0.3);
        border: #0c5084 solid 2px;
        margin-right: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;

        #b1 {
            font-size: 60px;
            color: #ff6316;
        }
    }

    .Supervision2 {
        width: 290px;
        height: 170px;
        background-color: rgba(37, 74, 184, 0.3);
        border: #0c5084 solid 2px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;

        #b1 {
            font-size: 60px;
            color: #ffe400;
        }
    }

    .Supervision3 {
        width: 290px;
        height: 170px;
        background-color: rgba(37, 74, 184, 0.3);
        border: #0c5084 solid 2px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;

        #b1 {
            font-size: 60px;
            color: #07e5ff;
        }
    }
}
</style>
